<!DOCTYPE html>
<html00>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>register</title>
    <script src="js/jquery-2.2.3.min.js"></script>
    <script src="js/jquery-ui.min.js"></script>
    <link type="text/css" href="css/jquery-ui.min.css" rel="stylesheet">
    <link type="text/css" href="css/register.css" rel="stylesheet">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <script src="js/bootstrap.min.js"></script>
    <script src="js/my.js"></script>
    <SCRIPT language = "JavaScript">
        function checkUserName(){    //验证用户名
            var fname = document.myform.username.value;
            var reg=/^[0-9a-zA-Z]/;
            if(fname.length != 0){
                for(i=0;i<fname.length;i++){
                    if(!reg.test(fname)){
                        alert("只能输入字母或数字");
                        return false;}
                }
                if(fname.length<4||fname.length>16){
                    alert("只能输入4-16个字符")
                    return false;
                }
            }
            else{    alert("请输入用户名");
                document.myform.username.focus();
                return false     }
            return true;
        }

        function passCheck(){ //验证密码
            var userpass = document.myform.password.value;
            if(userpass == ""){
                alert("未输入密码 \n" + "请输入密码");
                document.myform.password.focus();
                return false;   }
            if(userpass.length < 6||userpass.length>12){
                alert("密码必须在 6-12 个字符。\n");
                return false;   }
            return true;   }

        function passCheck2(){
            var p1=document.myform.password.value;
            var p2=document.myform.password2.value;
            if(p1!=p2){
                alert("确认密码与密码输入不一致");
                return false;
            }else{
                return true;
            }
        }

        function checkEmail(){
            var Email = document.getElementById("email").value;
            var e = Email.indexOf("@"&&".");
            if(Email.length!=0){
                if(e>0){
                    if(Email.charAt(0)=="@"&&"."){
                        alert("符号@和符号.不能再邮件地址第一位");
                        return false;
                    }
                    else{
                        return true;
                    }
                }
                else{
                    alert("电子邮件格式不正确\n"+"必须包含@符号和.符号！");
                    return false;
                }
            }
            else{
                alert("请输入电子邮件！")
                return false;
            }
        }

        function checkbirthday(){    //验证用户名
            var year = document.myform.birthday.value;
            if(year < 1949 || year > 2007){
                alert("年份范围从1949-2007年");
                return false;}
            return true;     }


        function validateform(){
            if(checkUserName()&&passCheck( )&&passCheck2()&&checkEmail()&&checkbirthday())
                return true;
            else
                return false;
        }

        function clearText( ) {
            document.myform.user.value="" ;
            document.myform.password.value="" ;
        }

        //显示隐藏对应的switchPwd()方法:
        $(function(){
            // 通过jqurey修改
            $("#passwordeye").click(function(){
                let type =  $("#password").attr('type')
                if(type === "password"){
                    $("#password").attr("type","text");
                }else{
                    $("#password").attr("type","password");
                }
            });
            $("#passwordeye2").click(function(){
                let type =  $("#password2").attr('type')
                if(type === "password"){
                    $("#password2").attr("type","text");
                }else{
                    $("#password2").attr("type","password");
                }
            });
        });

    </SCRIPT>
</head>
<body>
<img src="img/login_bg.jpg" class="bg">
<div id="head">
    <img src="img/register_head.png" width=100% height=auto />
</div>
<div id="center">
    <form name="myform" onSubmit="return validateform( )" enctype="multipart/form-data" action="cgi-bin/register.cgi" method="post" >
        <div class="input-group">
            <h3>用  户  名：</h3><input class="form-control"  id="username" name="username" type="text"  style="height:40px" value=""  placeholder="只能输入字母或数字，4-16个字符"/>
        </div>
        <div class="input-group">
            <h3>密       码：</h3><input class="form-control"  id="password" name="password" type="password" style="height:40px" value=""  placeholder="密码长度6-12位"/>
            <span class="input-group-btn">
            <INPUT class="btn btn-default" id="passwordeye" type="button" value="show/hide">
            </span>
        </div>
        <div class="input-group">
            <h3>确认密码：</h3><input class="form-control"  id="password2" name="password2" type="password" style="height:40px" value=""/>
            <span class="input-group-btn">
            <INPUT class="btn btn-default" id="passwords" type="button" value="show/hide">
        </span>
        </div>
        <div id="btn">
            <INPUT name="registerButton"  class="btn btn-primary" type="submit" id="register" value="注册"  onclick="checkUserName()">
                    
            <a href="login.html"><INPUT  class="btn btn-primary" name="loginButton" id="login" type="button" value="登录"></a>
        </div>
    </form>
</div>
<div id="bottom">
    <div class="footer" style="color:white;">
        Copyright © 2013-2021 All Rights Reserved. 备案号：JDY-SD87559
    </div>
</div>
</body>
</html00                 >